{% extends "test.html" %}
{% import "_macros.html" as mr%}

{% block tittle %}
<title>{{user.username}}的个人主页</title>
{% endblock %}



{% block title%}
<img src="{{user.avatar}}" width="180" height="180" class="circle">
{%  if current_user.is_authenticated %}
{% if user!= current_user%}
<div class="page-header">
    <h1>
        {{profile.nickname}}-Profile
        {% if not current_user.is_following(user) %}
        <a href="{{url_for('follow',username=user.username)}}" class="more_btn">关注</a>
        {% else %}
        <a href="{{url_for('unfollow',username=user.username)}}" class="more_btn">取消关注</a>
        {% endif %}
    </h1>
</div>
{% endif %}
{% else %}
<a href="{{url_for('follow',username=user.username)}}" class="more_btn">关注</a>
{% endif %}
{% endblock %}

{% block post %}
<div class="col-md-3">
    <a href="{{url_for('followers',username=user.username)}}">
        关注者：<span class="badge">{{user.followers.count()}}</span>
    </a>
    <a href="{{url_for('followed_by',username=user.username)}}">
        关注：<span class="badge">{{user.followed.count()}}</span>
    </a>
    <h3>昵称:
        {{profile.nickname}}
    </h3>
    <h3>性别：{{profile.gender}}</h3>
    <h3>生日：{{profile.birthday}}</h3>
    <h3>简介：{{profile.intro}}</h3>
</div>
<aside class="col-md-8">
    <h3>{{user.username}}发布的文章</h3>

    <div id="app">
        <div class="block">
            <el-timeline>
                {%for art in article%}
                <el-timeline-item timestamp="{{art.addtime}}" placement="top">
                    <el-card>
                        <h6><a href="{{url_for('posts',id=art.id)}}"><p>{{art.tittle}}</p></a></h6>
                        <div class="blog_allin_foot">
                            <div class="blog_text_li">
                                <a href="{{url_for('like',id=art.id)}}">点赞</a>
                                <i class="fa fa-thumbs-o-up" aria-hidden="true"> ：</i>{{art.likes.count()}}
                            </div>
                            <div class="blog_text_li">评论
                                <i class="fa fa-commenting-o" aria-hidden="true"> ：</i>{{art.comments.count()}}
                            </div>
                            <div class="blog_text_li">
                                <a href="{{url_for('posts',id=art.id)}}">浏览</a>
                                <i class="fa fa-street-view" aria-hidden="true"> ：</i>{{art.view}}
                            </div>
                        </div>
                    </el-card>
                </el-timeline-item>
                {% endfor %}
            </el-timeline>

        </div>
    </div>

     {{ mr.pagination_widget(art,'profileid',user.username)}}

</aside>
<div class="col-lg-9">
</div>

{% endblock%}
{%block col%}
{% endblock%}

{%block script%}
{{super()}}
<script>
        new Vue().$mount('#app')
    </script>
{% endblock %}